<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>原型链继承-方式1</h1>
    <p>该方式和采用Object.setPrototypeOf()方法替换子类原型的方案很接近。</p>
    <p>使用父类的实例，替换了自己的原型</p>
    <p>子类的实例原型直接指向 Parent.prototype，所以也使父、子类原型链产生关联，子类实例继承了父类原型的方法。</p>
    <h2>优点</h2>
    <ul>
        <li>子类实例可以直接调用父类原型上的属性（方法），实现了对父类原型属性的继承。</li>
        <li>同时子类实例可以继承父类内部定义的属性（可取）。</li>
        <li>父类不能调用子类原型上的方法（单继承，可取）。</li>
    </ul>
    <h2>缺点</h2>
    <ul>
        <li>子类原型的原本的constructor属性丢失。</li>
    </ul>
    <script>
        function Parent(name) {
            this.parentName = name;
            this.age = 35;
        }

        Parent.prototype.sayParentName = function() {
            console.log("sayParentName：",this.parentName);
        }

        function Child() {
            this.childName = "childName";
        }

        // 使用父类的实例，替换了自己的原型。
        console.log(Child.prototype);
        Child.prototype = new Parent();

        Child.prototype.sayChildName = function() {
            console.log("sayChildName：",this.childName);
        }

        let parent = new Parent("parentName");
        console.log(parent.parentName); // parentName
        parent.sayParentName(); // 正常调用
        // parent.sayChildName(); // 无法调用（正确）
        console.log(parent.childName); // undefined

        console.log("--------------chlid-------------")

        let child = new Child();
        console.log(child.age); // 35
        child.sayParentName(); // 正常调用（但是获取不到this.name）
        child.sayChildName(); // 正常调用
        
        console.log(Child.prototype);

        console.log(child instanceof Parent); // true

    </script>
</body>
</html>